
import { Dropdown } from "@/components/base";
import React from "react";

export function CapabilityDropdown(props: {
    expandOutList: any[],
    data?: any,
    index?: number,
    children?: React.ReactNode
}) {
    const items = React.useMemo(() => {
        return props.expandOutList
            .filter(e => e.isEnable ? e.isEnable(props.data, props.index) : true)
            .map((expandOut, i) => {
                return {
                    key: `${i}`,
                    label: expandOut.title,
                    disabled: expandOut.isDisabled ? expandOut.isDisabled(props.data || {}, props.index || 0) : false,
                    onClick: () => { expandOut.start?.(props.data, props.index) }
                }
            })
    }, [props.expandOutList, props.data, props.index])
    return (
        <Dropdown menu={{ items }}>
            <span>{props.children}</span>
        </Dropdown>
    )
}